<%@ page language="java" contentType="text/html; charset=UTF-8"	pageEncoding="UTF-8"%>
<%@ taglib uri="http://www.rapid-framework.org.cn/rapid" prefix="rapid"%>
<rapid:override name="frame-header-script">
<script src="static/js/jquery.min.js"></script>
<script>
//添加用户检查用户名是否存在
function checkUsername() {
    var result;
	if($("#userName").val()==""){
		 result=1;
		 $("#userNameTips").html("用户名不能为空").css("color","red");
	}
		 
	else{
    $.ajax({
        async: false,//同步，待请求完毕后再执行后面的代码
        type: "POST",
        url: 'user/checkUsername',
        //contentType: "application/x-www-form-urlencoded; charset=utf-8",
        data: {"username": $("#userName").val()},
        dataType: "json",
        success: function (data) {
            //用户名存在
            if(data==1) {
                $("#userNameTips").html("用户名存在").css("color","red");
                result=1;
            }
            //用户名不存在
            if(data==0) {
            	 $("#userNameTips").html("");
                result=0;
            }
        },
        error: function () {
            // alert("数据获取失败")
        }
    })
	}
    return result;
}

//添加用户检查电子邮箱是否存在
function checkUseremail() {
    var result;
    if($("#userEmail").val()==""){
    	result=1;
    	$("#userEmailTips").html("邮箱不能为空").css("color","red");
    }
    else{
    $.ajax({
        async: false,//同步，待请求完毕后再执行后面的代码
        type: "POST",
        url: 'user/checkUseremail',
        //contentType: "application/x-www-form-urlencoded; charset=utf-8",
        data: {"email": $("#userEmail").val()},
        dataType: "json",
        success: function (data) {
            //用户名存在
            if(data==1) {
                $("#userEmailTips").html("邮箱已被注册").css("color","red");
                result=1;
            }
            //用户名不存在
            if(data==0) {
            	$("#userEmailTips").html("");
                result=0;
            }
        },
        error: function () {
            //alert("数据获取失败")
        }
    })
    }
    return result;
}
function checkAll(){
	var result =false;
	if(checkUsername()==1||checkUseremail()==1)
	return false;
	else
	return true;
}


//添加用户验证和编辑用户验证
/*layui.use(['form', 'layedit', 'laydate'], function () {
    var form = layui.form, layer = layui.layer;
    form.verify({

        userName: function (value) {
            if (value.length > 12 || value.length < 4) {
                return "用户名必须4到12位";
            }
            if(checkUserName()==1) {
                return "用户名已存在";
            }
        },
        userEmail: function () {
            if(checkUserEmail()==1) {
                return "电子邮箱已存在";
            }
        }

    });

    form.on('submit(demo1)', function (data) {
        return true;
    });
});*/
</script>
</rapid:override>
			<rapid:override name="frame-content">
				<blockquote class="layui-elem-quote">
					<span class="layui-breadcrumb" lay-separator="/"> <a
						href="/admin">首页</a> <a href="/admin/user">用户列表</a> <a><cite>编辑用户</cite></a>
					</span>
				</blockquote>
				<br>
				<br>
				<form class="layui-form" action="user/add" id="userForm" method="post"
					enctype="multipart/form-data">
					<div class="layui-form-item">
						<label class="layui-form-label">头像</label>
						<div class="layui-input-inline">
							<div class="layui-upload">
								<div class="layui-upload-list" id="localImag">
									<img class="layui-upload-img" id="demo1" width="100" height="100">
								</div>
			
								<input type="file" name="photo" id="photo" type="file" style="display: none" onchange="preview(this,localImag,demo1,'100px','100px')">
								<button type="button" onclick="$('#photo').click()"
									class="layui-btn" id="test1">上传图片</button>
							</div>
						</div>
						<input type="hidden" name="userAvatar" id="userAvatar" value="">
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">用户名 <span
							style="color: #FF5722;">*</span></label>
						<div class="layui-input-inline">
							<input type="text" name="userName" id="userName"  required
								autocomplete="off" class="layui-input"
								onblur="checkUsername()">
						</div>
						<div  id="userNameTips"></div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">密码 <span
							style="color: #FF5722;">*</span></label>
						<div class="layui-input-inline">
							<input type="password" name="userPass" id="userPass" required
								lay-verify="userPass" autocomplete="off" class="layui-input"
								min="3" max="20">
						</div>
						<div class="layui-form-mid layui-word-aux"></div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">昵称 <span
							style="color: #FF5722;">*</span></label>
						<div class="layui-input-inline">
							<input type="text" name="userNickname" required placeholder=""
								autocomplete="off" min="2" max="10" class="layui-input">
						</div>
						<div class="layui-form-mid layui-word-aux"></div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">Email <span
							style="color: #FF5722;">*</span></label>
						<div class="layui-input-inline">
							<input type="email" name="userEmail" id="userEmail" required
								lay-verify="userEmail" class="layui-input"
								onblur="checkUseremail()">
						</div>
						<div id="userEmailTips"></div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">URL </label>
						<div class="layui-input-inline">
							<input type="url" name="userUrl" placeholder="" class="layui-input">
						</div>
					</div>
			
					<div class="layui-form-item">
						<div class="layui-input-block">
							<button  id="submit-btn" class="layui-btn"   type="submit" onclick="return checkAll()" >保存</button>
							<button type="reset"      class="layui-btn layui-btn-primary" >重置</button>
						</div>
					</div>
				</form>
			</rapid:override>
			
			<rapid:override name="frame-footer-script">
				<script>	//预览图片  
					function preview(docObj, localImagId, imgObjPreview, width, height) {
						if (docObj.files && docObj.files[0]) { //火狐下，直接设img属性        
							imgObjPreview.style.display = 'block';
							imgObjPreview.style.width = width;
							imgObjPreview.style.height = height;
							//火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式        
							imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
						} else { //IE下，使用滤镜      
							docObj.select();
							var imgSrc = document.selection.createRange().text;
							//必须设置初始大小        
							localImagId.style.width = width;
							localImagId.style.height = height;
							//图片异常的捕捉，防止用户修改后缀来伪造图片        
							try {
								localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
								localImagId.filters
										.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
							} catch (e) {
								alert("您上传的图片格式不正确，请重新选择!");
								return false;
							}
							imgObjPreview.style.display = 'none';
							document.selection.empty();
						}
					}
				</script>
			</rapid:override>
			
			<%@ include file="../framework.jsp"%>